// components/goods-share.js
var app = getApp();
var util = require('../../utils/util.js');
var method = require('../../utils/function.js');
Component({
    /**
     * 组件的属性列表
     */
    properties: {
        //标题
        textVivo: null,
        //banner
        textImg: null,
        //1、拼团；2、砍价；3、普通商品
        type: null,
        qrcodeValue: null,
        goods_id: null,
        //划线价格
        linePrice: null,
        //展示价格
        price: null,
        subtitle: null
    },

    /**
     * 组件的初始数据
     */
    data: {
        canvasHidden: true, //设置画板的显示与隐藏，画板不隐藏会影响页面正常显示
        ewmHidden: true, //设置画板的显示与隐藏，画板不隐藏会影响页面正常显示
    },

    lifetimes: {
        // 生命周期函数，可以为函数，或一个在methods段中定义的方法名
        attached: function() {
            var that = this;
            wx.getSystemInfo({
                success: res => {
                    that.setData({
                        screenWidth: res.screenWidth,
                        screenHeight: res.screenHeight
                    })
                }
            })
        },
    },
    /**
     * 组件的方法列表
     */
    methods: {
        saveImg: function(e) {
            util.showLoading('图片生成中');
            var that = this;
            that.setData({
                ewmHidden: false
            }, function() {
                util.http('/api/v1/member/index', {}, function(res) {
                    console.log('components', res)
                    //下载头像
                    wx.downloadFile({
                        url: res.datas.avatar,
                        success: function(result) {
                            //下载banner
                            util.http('/api/v1/common/get_share_goods_img', {
                                goods_id: that.data.goods_id
                            }, function(bannerInfo) {
                              console.log('bannerInfo',bannerInfo);
                                wx.downloadFile({
                                    url: bannerInfo.datas,
                                    success: function(textImgResult) {
                                        that.setData({
                                            textImgDown: textImgResult.tempFilePath,
                                            avatarUrl: result.tempFilePath,
                                            textName: res.datas.nickname
                                        }, function() {
                                            const thatssa = that.selectComponent('#qrcode')
                                            console.log('thatssa', thatssa)
                                            wx.canvasToTempFilePath({
												canvasId: 'wux-qrcode',
                                                width: 375,
                                                height: 533,
                                                destWidth: 375 * 2,
                                                destHeight: 533 * 2,
                                                success: res => {
                                                    that.setData({
                                                        rwmImg: res.tempFilePath,
                                                    }, function() {
                                                        console.log('that.data.avatarUrl', that.data.avatarUrl)
                                                        console.log(that.data.avatarUrl)
                                                        that.setData({
                                                            canvasHidden: false
                                                        })

                                                        const systemInfo = wx.getSystemInfoSync()

                                                        wx.getSystemInfo({
                                                            success: res => {
                                                                console.log(res);
                                                                that.setData({
                                                                    screenWidth: res.screenWidth,
                                                                    screenHeight: res.screenHeight
                                                                })
                                                            }
                                                        })
                                                        var unit = that.data.screenWidth / 375;
                                                        console.log('unit', unit)
                                                        var butback = "/images/bgbgbg.png";
                                                        const ctx = wx.createCanvasContext('starkImg', that);
                                                        ctx.drawImage(butback, 0, 0, 375, 533);
                                                        //logo
                                                        ctx.drawImage(that.data.avatarUrl, 16, 9, 29, 29);
                                                        //logo右侧提示词
                                                        ctx.setFontSize(15)
                                                        ctx.fillText('向往本来的生活', 57, 30);
                                                        //红色背景
                                                        method.fillRoundRect(ctx, 16, 46, 345, 345, 6, '#f00');
                                                        //正文图片
                                                        ctx.drawImage(that.data.textImgDown, 22, 52, 332, 282, 0, 0);
                                                        //绘制标题
                                                        var chr = that.data.subtitle;
                                                        if (chr.length > 8) {
                                                            chr = chr.substring(0, 8) + '...';
                                                        }
                                                        ctx.setFontSize(25);
                                                        ctx.setFillStyle('#fff');
                                                        ctx.fillText(chr, 22, 365 + 6, 200);
                                                        // var temp = "";
                                                        // var row = [];
                                                        // ctx.setFontSize(18)
                                                        // ctx.setFillStyle("#000")
                                                        // for (var a = 0; a < chr.length; a++) {
                                                        //   if (ctx.measureText(temp).width < unit * 200) {
                                                        //     temp += chr[a];
                                                        //   } else {
                                                        //     a--; //这里添加了a-- 是为了防止字符丢失，效果图中有对比
                                                        //     row.push(temp);
                                                        //     temp = "";
                                                        //   }
                                                        // }
                                                        // row.push(temp);
                                                        // if (row.length > 2) {
                                                        //   var rowCut = row.slice(0, 2);
                                                        //   var rowPart = rowCut[1];
                                                        //   var test = "";
                                                        //   var empty = [];
                                                        //   for (var a = 0; a < rowPart.length; a++) {
                                                        //     if (ctx.measureText(test).width < 200) {
                                                        //       test += rowPart[a];
                                                        //     } else {
                                                        //       break;
                                                        //     }
                                                        //   }
                                                        //   empty.push(test);
                                                        //   var group = empty[0] + "..."
                                                        //   rowCut.splice(1, 1, group);
                                                        //   row = rowCut;
                                                        // }
                                                        // for (var b = 0; b < row.length; b++) {
                                                        //   ctx.setFontSize(25)
                                                        //   ctx.setFillStyle('#fff')
                                                        //   ctx.fillText(row[b], 22, 365 + 6 + b * 20, 200);
                                                        // }
                                                        //价格背景图
                                                        ctx.drawImage('/images/price-bg.png', 235, 320, 126, 71, 0, 0);
                                                        //价格
                                                        var price = that.data.price;
                                                        var grd = ctx.createLinearGradient(254, 365, 354, 465);
                                                        grd.addColorStop(0, "#FDFAF1");
                                                        grd.addColorStop(1, "#E2B817");
                                                        ctx.setFontSize(28)
                                                        ctx.setFillStyle(grd);
                                                        ctx.fillText(price, 254, 365, 200);
                                                        //商品描述
                                                        var subtitle = that.data.textVivo;
                                                        var chr = subtitle.split("");
                                                        var temp = "";
                                                        var row = [];
                                                        ctx.setFontSize(16)
                                                        ctx.setFillStyle("#333")
                                                        for (var a = 0; a < chr.length; a++) {
                                                            if (ctx.measureText(temp).width < 233) {
                                                                temp += chr[a];
                                                            } else {
                                                                a--; //这里添加了a-- 是为了防止字符丢失，效果图中有对比
                                                                row.push(temp);
                                                                temp = "";
                                                            }
                                                        }
                                                        row.push(temp);
                                                        if (row.length > 2) {
                                                            var rowCut = row.slice(0, 2);
                                                            var rowPart = rowCut[1];
                                                            var test = "";
                                                            var empty = [];
                                                            for (var a = 0; a < rowPart.length; a++) {
                                                                if (ctx.measureText(test).width < 233) {
                                                                    test += rowPart[a];
                                                                } else {
                                                                    break;
                                                                }
                                                            }
                                                            empty.push(test);
                                                            var group = empty[0] + "..."
                                                            rowCut.splice(1, 1, group);
                                                            row = rowCut;
                                                        }
                                                        console.log('row', row);
                                                        for (var b = 0; b < row.length; b++) {
                                                            ctx.fillText(row[b], 16, 424 + b * 22, 233);
                                                        }
                                                        switch (that.data.type) {
                                                            case '1':
                                                                var type = '拼团价：';
                                                                break;
                                                            case '2':
                                                                var type = '最低价：';
                                                                break;
                                                            case '3':
                                                                var type = '优惠价：';
                                                                break;
                                                        }
                                                        //左下角价格
                                                        ctx.setFontSize(14)
                                                        ctx.setFillStyle("#999");
                                                        ctx.fillText(type, 16, 508);

                                                        ctx.setFontSize(18)
                                                        ctx.setFillStyle("#D50321");
                                                        ctx.fillText(price, 70, 508);

                                                        var garyWidth = 90 + ctx.measureText(price).width;
                                                        var linePrice = that.data.linePrice;
                                                        ctx.setFontSize(12)
                                                        ctx.setFillStyle("#999");
                                                        ctx.fillText(linePrice, garyWidth, 508);
                                                        ctx.save();

                                                        ctx.setFillStyle('#999')
                                                        ctx.fillRect(garyWidth, 502, ctx.measureText(linePrice).width, 1)
                                                        //二维码
                                                        ctx.drawImage(that.data.rwmImg, 268, 408, 92, 92);
                                                        //长按识别二维码
                                                        var txt = "长按识别二维码";
                                                        ctx.setFontSize(13)
                                                        ctx.setFillStyle("#999");
                                                        ctx.fillText(txt, 268, 518, 96);
                                                        ctx.draw();
                                                        //将生成好的图片保存到本地，需要延迟一会，绘制期间耗时
                                                        setTimeout(function() {
                                                            util.showLoading('保存中');
                                                            wx.canvasToTempFilePath({
                                                                canvasId: 'starkImg',
                                                                success: function(res) {
                                                                    var tempFilePath = res.tempFilePath;
                                                                    that.setData({
                                                                        imagePath: tempFilePath,
                                                                        canvasHidden: true
                                                                    });

                                                                    if (!res.tempFilePath) {
                                                                        wx.showModal({
                                                                            title: '提示',
                                                                            content: '图片绘制中，请稍后重试',
                                                                            showCancel: false
                                                                        })
                                                                    }
                                                                    //画板路径保存成功后，调用方法吧图片保存到用户相册
                                                                    wx.saveImageToPhotosAlbum({
                                                                        filePath: res.tempFilePath,
                                                                        //保存成功失败之后，都要隐藏画板，否则影响界面显示。
                                                                        success: (res) => {
                                                                            //  console.log(res)
                                                                            wx.hideLoading()
                                                                            wx.showToast({
                                                                                title: '保存成功',
                                                                            })
                                                                            that.setData({
                                                                                canvasHidden: true,
                                                                                ewmHidden: true,
                                                                            })
                                                                        },
                                                                        fail: (err) => {
                                                                            // console.log(err)
                                                                            wx.hideLoading()
                                                                            that.setData({
                                                                                canvasHidden: true,
                                                                                ewmHidden: true,
                                                                            })
                                                                        }
                                                                    })
                                                                },
                                                                fail: function(res) {
                                                                    console.log('保存失败', res);
                                                                }
                                                            }, that);
                                                        }, 200);
                                                    });
                                                },
                                                fail: function(err) {
                                                    console.log('二维码错啦！？？？', err);
                                                },
                                            }, thatssa)
                                        })
                                    },
                                    fail: function() {
                                        wx.showToast({
                                            title: '商品图片异常',
                                            icon: 'none'
                                        })
                                    }
                                })
                            });

                        },
                        fail: function() {
                            wx.showToast({
                                title: '用户头像异常',
                                icon: 'none'
                            })
                        }
                    })
                })
            })
        },
    }
})